<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>响应式登录界面</title>
    <link rel="stylesheet" href="css/login.css">
    <script src="js/jquery.min.js"></script>
    <script src="js/axios.min.js"></script>
</head>
<body>
<div class="content">
    <div class="login-content">
        <a href="#" class="banner-box"></a>
<%--        <div class="login-box">--%>
            <form autocomplete="off" id="myForm" class="login-box" action="/user?type=main" method="post">
                <h1>账号登录</h1>
                <input type="text" placeholder="账号" id="uname" name="uname">
                <input type="password" placeholder="密码" id="upwd" name="upwd">
                <button type="button" class="login-btn" id="btn">登录</button>
            </form>
<%--        </div>--%>
    </div>
</div>

<script>
    let uname = $("#uname");
    let upwd = $("#upwd");
    let btn = $("#btn");
    let myForm = $("#myForm");
    btn.on("click", function () {
        if (uname.val() === "" || upwd.val() === "") {
            alert("用户名和密码不可为空！！！");
        } else {
            axios.get("/user?type=checkLogin", {
                params: {
                    uname: uname.val(),
                    upwd: upwd.val()
                }
            }).then(res=>{
                if (res.data !== null) {
                    console.log("登录成功：" + res.data);
                    myForm.submit();
                } else {
                    console.log("登录失败");
                    alert("登录失败！！！")
                }
            });
        }
    });
</script>
</body>
</html>
